<template>
    <div>
        <Head/>
        <div class="imgdiv">
            <img src="../../assets/XiaoPictureWalking/background.jpg" class="mybackground">
        </div>
        <div class="back2div">
            <PictureWalking/>
            <TopSelling/>
        </div>
        <Tail/>
    </div>
</template>

<script>
import Head from '../universalpage/head/XiaoHead.vue'
import Tail from '../universalpage/tail/XiaoTail.vue'
import PictureWalking from './XiaoPictureWalking'
import TopSelling from './XiaoTopSelling.vue'
    export default {
        name:'XiaoHomePage',
        components:{Head,Tail,
                    PictureWalking,TopSelling}, 
    }
</script>

<style scoped>
.imgdiv{
    text-align: center;
    overflow: hidden;
}
.mybackground{
    margin-left: -100px;
    /* z-index: 3; */
    height: 500px;
}
.back2div{
    margin-top: -7px;
    box-shadow: 0 -30px 0px 0px #ff2f5c;
    background-color: #ff2f5c;
    height: 700px;
    margin-bottom: 55px;
}
</style>